<template>
	<view>
		<navbar  title="商家管理" :isGoBack="true" :isNotice="true" ></navbar>	
			
		<view class="p-20">
		  <view class="about border-radius box-shadow">
			<view class="about-header">
			<image class="about-header__image" :src="shopInfo.shop_logo"></image>
			</view>
		
			<view class="specs-top-title" style="font-size: 30rpx;">店铺名称</view>
			<view  class="specs-top-name mt-10">{{shopInfo.storage_shop_name}}</view>
		
			  <view class="specs-top-title" style="font-size: 30rpx;">公告</view>
			  <view  class="specs-top-desc mt-10" v-if="!shopInfo.shop_intro">商家暂无公告</view>
			  <view  class="specs-top-desc mt-10 mr-25" v-if="shopInfo.shop_intro">{{shopInfo.shop_intro}}</view>
		
		
			  <view class="specs-top-title" style="font-size: 30rpx;">店铺信息</view>
			  <view class="specs-top-desc" style="font-size: 25rpx;">
				<view class="mt-10">营业时间：24小时营业</view>
				<view class="mt-10">营业电话：{{shopInfo.link_phone}}</view>
				<view class="localtion mt-10">
					<view>门店地址：{{shopInfo.province}}{{shopInfo.city}}{{shopInfo.area}}{{shopInfo.address}}</view>
				</view>       
			  </view>
		
			  <view class="specs-top-title" style="font-size: 30rpx;">
				<text class="mb-20">店铺状态</text>
				<view style="display: flex;justify-content: space-between; align-items: center;">
					 <u-switch v-model="shopInfo.status == 0 ? false : true"  asyncChange @change="asyncChange(shopInfo)"  ></u-switch>
					<text v-if="shopInfo.status==1">营业中</text>
					<text v-if="shopInfo.status==0">已打烊</text>
				</view>			   
			  </view>  		   
		  </view>
		  <button class="about-button" style="background:#2B91ED" @click="copyWechatCode" open-type="share">分享店铺</button>
		</view>
			
	</view>
</template>

<script>
	export default {
		data() {
			return {
				shopInfo:{}
			}
	    },		
		onShow() {	
			let userInfo=uni.getStorageSync('userInfo')
			let dataJson={
			  token:userInfo.app_openid,
			  login_type:'app',
			  storageId:userInfo.storageId
			}
			this.$http.shopInfo(dataJson).then(res=>{
			  if(res.resCode=='9999'){
				this.shopInfo=res.data.header
			  }
			})
		},
		methods:{
			asyncChange(event){
				let storageId=event.id
				let status= event.status==true?0:1
				this.$http.setShopInfo({storageId,status}).then(res=>{
                        this.shopInfo.status=status
				})
			},
			copyWechatCode(){
				console.log('oks')
				let userInfo=uni.getStorageSync('userInfo')
				uni.share({
					provider: 'weixin',
					scene: "WXSceneSession", //分享类型（聊天，朋友圈）
					type: 5,//类型 
					title: "您的好友邀您使用【蜀靓鸭】",
					imageUrl: 'https://jinning-image.zhuangdongxiang.cn/2024-01-30/1fca35595939489bfeacb02eed64884a.jpg',//不能大于20kb
					miniProgram: {
						id: "gh_6a20ec5def8d",//小程序原始ID
						path: "/pages/class/index",//小程序页面路径，传参也是?拼接
						query: "storageId="+this.shopInfo.id+"&memberId="+userInfo.id, 
						webUrl: "https://duck.zhuangdongxiang.cn?order=1",//地址
						type: 0 //微信小程序版本类型，可取值： 0-正式版； 1-测试版； 2-体验版。 默认值为0。
					},
					success: res => {
						console.log(res);
					},
					fail: function(err) {
							console.log(err);
					}										
				});
			}
		}
	}
</script>

<style>
	
	  /* pages/mine/about/index.wxss */
	  .about{
	    background: white;
	    padding: 10rpx 20rpx;
	    height: 1080rpx;
	  }
	
	  .about-header{
	    margin-top: 80rpx;
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    justify-content: center;
	  }
	
	  .about-header__image{
	    height: 350rpx;
	    width: 350rpx;
	    display: block;
	    background: rgb(216, 216, 216);
	  }
	
	  .about-header__text{
	    font-size: 28rpx;
	    padding: 10rpx 0 30rpx 0;
	    color: #666666;
	  }
	
	  .about-content{
	    color: #666666;
	    font-size: 28rpx;
	    line-height: 50rpx;
	    padding: 0 20rpx;
	  }
	
	  .about-button{
	    margin-top: 40rpx;
	    font-size: 28rpx;
	    line-height: 80rpx;
	    height: 80rpx;
	    color: #FFFFFF;
	  }
	
	  .about-button:active{
	    opacity: 0.5;
	  }
	
	  /* component/specs/index.wxss */
	
	  .specs-top-desc{
	    display: flex;
	    flex-direction: column;
	    font-size: 25rpx;
	    margin-left: 35rpx;
	    color: #2B91ED; 
	    font-weight: bold; 
	  }
	
	  .specs-top-name{
	    display: flex;
	    flex-direction: column;
	    font-size: 25rpx;
	    margin-left: 35rpx;
	    color: #2B91ED;  
	    align-items: center;
	    font-weight: bold;
	  }
	
	  .specs-top-title{
	    display: flex;
	    flex-direction: column;
	    font-size: 25rpx;
	    margin-left: 35rpx;  
	    margin-top: 25rpx;
	    
	  }
	
	  .localtion{
	    display: flex;
	    flex-direction: row;
	    /* color: gray; */
	  }
	
	  .specs-top{
	    display: flex;
	    flex-direction: row;
	    font-size: 23rpx;
	    justify-content: center;
	    align-items: center;
	    padding-bottom: 10rpx;
	    border-bottom: 1rpx solid rgb(240, 235, 235);
	
	  
	  }
</style>